/**
 * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
 * SPDX-License-Identifier: MIT
 */

import React from 'react';
import { Button, Modal, Card  } from 'antd';
import { WorkflowDragService, useService } from '@flowgram.ai/free-layout-editor';

const cardkeys = [
  'Condition',
  'asset_edit',
  'section_edit',
  'entrust_edit',
  'public_edit',
  'confirm_listed',
  'deal_confirm',
  'deal_notice',
  'deal_voucher',
  'money_receive',
  'money_transfer',
  'pause',
  'end',
];
const titleMap = {
  asset_edit: '资产信息',
  section_edit: '标的信息',
  Condition: '条件判断',
  entrust_edit: '委托信息',
  public_edit: '披露信息',
  confirm_listed: '确认挂牌',
  deal_confirm: '成交确认',
  deal_notice: '成交公告',
  deal_voucher: '交易凭证',
  money_receive: '收款',
  money_transfer: '转账',
  pause: '中止',
  end: '终结',
};

export const NodeAddPanel: React.FC = (props) => {
  const startDragSerivce = useService<WorkflowDragService>(WorkflowDragService);
  //从左侧拖入画板后元素的渲染情况。data 为节点数据源
  return (
    <div className="demo-free-sidebar">
      {cardkeys.map((nodeType) => (
        <div
          key={nodeType}
          className="demo-free-card"
          onMouseDown={(e) =>
            startDragSerivce.startDragCard(nodeType.toLowerCase(), e, {
              data: {
                title: titleMap[nodeType as keyof typeof titleMap] || '未知类型',
                // content: 'xxxx',
                // name: '标的名称',
              },
            })
          }
        >
          {titleMap[nodeType as keyof typeof titleMap] || '未知类型'}
        </div>
      ))}
    </div>
  );
};
